<template>
	<view class="container">
		<u--form ref="queryForm" :model="query">
			<u-form-item label="" prop="box" style="display: flex;">
				<span style="margin-right: 20rpx;">容器码</span>
				<u--input 
						placeholder="请输入/扫描" 
						v-model="query.containerCode" 
						suffixIcon="scan" 
						suffixIconStyle="font-size: 68rpx"
						style="flex: 1;">
				</u--input>
			</u-form-item>
			<u-form-item label="" prop="storage" style="display: flex;">
				<span style="margin-right: 20rpx;">储位码</span>
				<u--input 
						placeholder="请输入/扫描" 
						v-model="query.storage" 
						suffixIcon="scan" 
						suffixIconStyle="font-size: 68rpx"
						style="flex: 1;">
				</u--input>
			</u-form-item>
		</u--form>
		<view style="display: flex;margin-top: 20rpx;">
			<view style="flex: 2;">物料名称</view>
			<view style="flex: 2;">储位码</view>
			<view style="flex: 1;">
			</view>
		</view>
		<view v-for="(item, index) in list" :key="index">
			<u-cell :border="index !== list.length - 1">
				<view
						slot="title"
						class="u-slot-title"
				>
					<view style="display: flex;align-items: center;">
						<view style="flex: 2;">物料{{index + 1}}</view>
						<view style="flex: 2;">storageCode{{index + 1}}</view>
						<checkbox-group style="flex: 1;text-align: end;">
							<label>
								<checkbox value="cb" checked="true"/>
							</label>
						</checkbox-group>
					</view>
				</view>
			</u-cell>
		</view>
		<view style="margin-top: 20rpx;">
			<u-button type="primary">确认</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				query: {
					containerCode: '',
					storage: ''
				},
				list: ['', '', '']
			};
		},
		onLoad(options) {
			uni.$on('scancodedate',(data) => this.getCode(data.code))
		},
		onUnload() {  
		  // 移除监听事件      
		  uni.$off('scancodedate')
		},
		methods: {
			getCode(code) {
				// this.query.containerCode = code
			}
		}
	}
</script>

<style lang="scss">

</style>
